<template>

  <div>
    <div style=" text-align: center;">
      <h1>需求发布</h1>
    </div>
    <div class="form">
      <el-form class="demo-ruleForm" v-model="queryFaBu" label-width="80px">
        <el-form-item label="项目名称">
          <el-input type="textarea" :rows="4" :autosize="{ minRows: 2, maxRows: 4}" placeholder="请输入项目名称" v-model="queryFaBu.projectName">
          </el-input>
        </el-form-item>
        <el-form-item label="项目描述">
          <el-input type="textarea" :rows="4" :autosize="{ minRows: 2, maxRows: 4}" placeholder="请输入项目描述描述" v-model="queryFaBu.projectDescribe">
          </el-input>
        </el-form-item>
        <el-form-item label="项目内容">
          <!-- <el-input
          type="textarea"
          :rows="4"
          placeholder="请输入项目描述描述"
          v-model="queryFaBu.projectDescribe"
        >
        </el-input> -->
          <Editor v-model="queryFaBu.projectFile" :height="200"></Editor>
        </el-form-item>
        <div class="button">
          <el-button type="primary" @click="submitProject">确认发布</el-button>
        </div>
      </el-form>
    </div>
  </div>
</template>
<script>
import { XuqiuFaBu } from '../api/api'
export default {
  data() {
    return {
      queryFaBu: {
        projectName: '',
        projectDescribe: ''
      }
    }
  },
  methods: {
    submitProject() {
      if (this.queryFaBu.projectName) {
      } else {
        this.$message.error('请输入项目名称')
        return
      }
      XuqiuFaBu(this.queryFaBu)
        .then(result => {
          if (result.data.code != 200) {
            this.$message({
              message: '发布失败' + result.data.code,
              type: 'warning'
            })
          } else if (result.data.code == 200) {
            this.$message({
              message: '发布成功',
              type: 'success',
              duration: 1000,
              onClose: () => {
                this.$router.push('/XiangmuGuanli')
              }
            })
          }
        })
        .catch(err => {
          console.log(err)
        })
    }
  },
  mounted() {}
}
</script>
<style lang="less" scoped>
// .form {
//   margin: 20px auto;
//   padding: 40px;
// }
.button {
  margin-top: 50px;
  display: flex;
  justify-content: center;
  align-content: center;
}
</style>